<template>
	<view class="text-center">
		<view class="top-image">
			<img src="../../static/logo.png" alt="" />
		</view>
		<view class="register-title">
			<text >登录</text>
		</view>
		<view class="register-context">
			<text >在此登录你的账号</text>
		</view>
		<view class="padding-lr margin-lr">
			<view class="margin-tb">
				账号
			</view>
			<custom-input 
			v-model="username"
			holder="请输入账号">
				<text class="iconfont icon-wode"></text>
			</custom-input>
        </view>
		<view class="padding-lr margin-lr">
			<view class="margin-tb">
				密码
			</view>
			<custom-input 
			v-model="password"
			holder="请输入密码"
			type="password">
				<text class="iconfont icon-mima"></text>
			</custom-input>
		</view>
		<view class="padding margin-top">
			<button class="cu-btn bg-orange block"
			@click="handleLogin"
			>
			登录</button>
		</view>
		<view class="padding margin-top">
			<button class="cu-btn bg-orange block"
			@click="handleGoRegister"
			>
			注册</button>
		</view>
	</view>
</template>

<script setup lang="ts">
import { ref, type Ref } from '@vue/runtime-core';
import { useStore } from 'vuex'
const username:Ref<string>=ref('anan')
const password:Ref<string>=ref('123')
const store =useStore()
const handleLogin=()=>{
	store.dispatch('user/loginActions',{
		"username":username.value,
		"password":password.value
	})
	
}
const handleGoRegister=()=>{
	uni.navigateTo({
		url:"/pages/account/register"
	})
}
</script>

<style lang="scss">
.register-view{
	display: flex;
	flex-direction: column;
	align-items: center; /* 子元素水平居中 */
	text-align: center; /* 文本居中 */
}
.top-image img{
	width: 183.49rpx;
	height: 183.49rpx;
	margin-top: 60rpx;
}
.register-title{
	font-size: 45.87rpx;
	margin-top:60rpx ;
}
.register-context{
	font-size:32.11rpx;
	color: rgba(102, 110, 122, 1);
	margin-top:30rpx ;
} 
  page{
	  background-color: #fff;
  }
</style>
